<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: fzy-2
  Date: 2021/4/13
  Time: 16:03
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<% String path = request.getContextPath(); %>
<html>
<head>
    <meta charset="utf-8">
    <title>上机考试系统</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- le styles -->
    <link href="<%=path%>/css/bootstrap.css" rel="stylesheet">
    <link href="<%=path%>/css/exam.css" rel="stylesheet">
    <style>
        body {
            padding-top: 60px;
            /* 60px to make the container go all the way to the bottom of the topbar */
        }
    </style>
    <link href="<%=path%>/css/bootstrap-responsive.css" rel="stylesheet">

    <!-- le html5 shim, for ie6-8 support of html5 elements -->
    <!--[if lt ie 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
</head>

<body>

<%@ include file="/WEB-INF/pages/Admin/admin_header.jsp"%>

<div class="container">

    <h1>
        <img src="<%=path%>/img/exam-admin.png" alt=""/> 系统管理
    </h1>

    <c:if test="${adminid == 0}">
        <div class="exam-alert">没有设置管理员帐号，默认管理员帐号存在安全风险，请尽快处理！</div>
    </c:if>
    <br/>


    <form class="exam-form form-inline" action="<%=path%>/admin/addTeacher" method="post">
        <h4>添加教师</h4>
        <label>
            <input type="text" name="name" placeholder="用户名*" size="20"/>
        </label>
        <label>
            <input type="text" name="pass" placeholder="初始口令*" size="20"/>
        </label>
        <label>
            <input type="text" name="fullname" placeholder="真实姓名" size="20"/>
        </label>
        <label>
            <input type="checkbox" name="isadmin" value="true"/>
            <input type="hidden" name="isadmin" value="" checked="checked">
        </label>
        管理员
        <input type="submit" name="action" class="btn btn-primary" value="添加"/>
    </form>

    <table class="table table-striped table-bordered">
        <thead>
        <tr>
            <th class="span4">用户名</th>
            <th class="span4">全名</th>
            <th class="span3">是否管理员</th>
            <th class="span2">操作</th>
        </tr>
        </thead>
        <tbody>
        <c:forEach items="${teachers}" var="teacher">
            <tr>
                <th class="span4">${teacher.name}</th>
                <th class="span4">${teacher.fullname}</th>
                <th class="span3"><label>
                    <c:if test="${teacher.isadmin == true}">
                        <input type="checkbox" checked="checked" disabled/>
                    </c:if>
                    <c:if test="${teacher.isadmin == false}">
                        <input type="checkbox" disabled/>
                    </c:if>
                </label></th>
                <th class="span2">
                    <button class="btn btn-primary edit">编辑</button>
                    <button class="btn btn-primary delete">删除</button>
                </th>
                <input class="teacherId" name="input" type="hidden" value="${teacher.id}"/>
            </tr>
        </c:forEach>
        </tbody>
    </table>
</div>
<!-- /container -->
<!-- placed at the end of the document so the pages load faster -->
<script src="<%=path%>/js/jquery.min.js"></script>
<script src="<%=path%>/js/bootstrap.min.js"></script>
<script>
    const deleteBtn = $(".delete");
    const editBtn = $(".edit");
    const teacherId = $(".teacherId");
    for (let i = 0; i < editBtn.length; i++) {
        editBtn[i].addEventListener("click", function () {
            let a = document.createElement("a");
            let href = "${pageContext.request.contextPath}/admin/admin_teacher_modify?id=" + $(teacherId[i]).val();
            a.href = href;
            a.click();
        })
    }
    for (let i = 0; i < deleteBtn.length; i++) {
        deleteBtn[i].addEventListener("click", function () {
            console.log($(teacherId[i]).val())
            $.ajax({
                type: "POST",
                url: "${pageContext.request.contextPath}/admin/deleteTeacher",
                data: {id: $(teacherId[i]).val()},
                success: function (data) {
                    console.log(data);
                },
                error: function (e) {
                    console.log(e);
                }
            })
        })
    }
    <%--想通过ajax局部刷新，有问题，不用，现在全页面刷新--%>
    <%--    function deleteTeacher(){--%>
    <%--        var deleteBtn = $(".delete");--%>
    <%--        var teacherId = $(".teacherId");--%>
    <%--        for(let i=0;i<deleteBtn.length;i++){--%>
    <%--            deleteBtn[i].addEventListener("click",function () {--%>
    <%--                console.log($(teacherId[i]).val())--%>
    <%--                $.ajax({--%>
    <%--                    type:"POST",--%>
    <%--                    url:"${pageContext.request.contextPath}/admin/deleteTeacherAjax",--%>
    <%--                    data:{id:$(teacherId[i]).val()},--%>
    <%--                    success:function (data) {--%>
    <%--                        console.log(data);--%>
    <%--                        teachers = data.teachers;--%>
    <%--                        console.log(teachers);--%>
    <%--                        var tbody = $("tbody");--%>
    <%--                        // tbody.empty();--%>
    <%--                        $.each(teachers,function (index,teacher) {--%>
    <%--                            outputData(tbody,teacher);--%>
    <%--                        });--%>
    <%--                    },--%>
    <%--                    error:function (e) {--%>
    <%--                        console.log(e);--%>
    <%--                    }--%>
    <%--                })--%>
    <%--            })--%>
    <%--        }--%>
    <%--    }--%>
    <%--    deleteTeacher();--%>
    <%--    function outputData(tbody,teacher) {--%>
    <%--        tbody.append("<tr>"+--%>
    <%--            "<th class='span4'>"+teacher.name+"</th>"+--%>
    <%--            "<th class='span4'>"+teacher.fullname+"</th>"+--%>
    <%--            "<th class=‘span3’><input type='checkbox' disabled/></th>"+--%>
    <%--            "<th class='span1'><button class='btn btn-primary delete'>删除</button></th>"+--%>
    <%--            "<th style='display: none'><input class='teacherId' name='input' type='number' value='${teacher.id}'/></th>"--%>
    <%--        )--%>
    <%--    }--%>
</script>
</body>
</html>
